<template>
  <div class="content">
    <router-view></router-view>
    <div class="app-footer">
      <router-link to="hot" tag="span">
        <div class="app-footer_box">
          <div class="img">
            <img src="../hot/icons/155352224914259456.png" alt="#" />
          </div>
          <div>首页</div>
        </div>
      </router-link>
      <div class="app-footer_box">
        <div class="img">
          <img src="../hot/icons/155352235108424095.png" alt="#" />
        </div>
        <div>找货</div>
      </div>
      <div class="app-footer_box">
        <div class="img">
          <img src="../hot/icons/155352230873073172.png" alt="#" />
        </div>
        <div>拼购推荐</div>
      </div>
      <div class="app-footer_box">
        <div class="img">
          <img src="../hot/icons/155352220182354151.png" alt="#" />
        </div>
        <div>玩法介绍</div>
      </div>
      <router-link to="myCommodity" tag="span">
      <div class="app-footer_box">
        <div class="img">
          <img src="../hot/icons/155352224914259456.png" alt="#" />
        </div>
        <div>我的拼购</div>
      </div>
    </router-link>
    </div>
  </div>
</template>
<script>
export default {
  name: 'index',
  data() {
    return {
    };
  },
};
</script>

<style scoped lang="scss">
.content {
  /*width: 100vw;*/
  /*height: 100vw;*/
  /*margin-top: 275px;*/
  /*margin-bottom: 162px;*/
  padding-bottom: 200px;
  .app-footer {
    width: 100vw;
    height: 162px;
    background: #eb6b62;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    font-size: 0;
    z-index: 999;
    .app-footer_box {
      display: inline-block;
      width: 20%;
      text-align: center;
      font-size: 32px;
      .img {
        margin: 18px auto 3px auto;
        width: 85px;
        height: 85px;
        img {
          width: inherit;
          height: inherit;
          object-fit: cover;
        }
      }
    }
  }
}
</style>
